{{--模板继承--}}
@extends('layouts.seller_layout')

{{--css style page元素同级上面--}}
@section('style')

@stop

{{--content--}}
@section('content')

    <!--第一步-->
    <div style="display: block" class='page-1 pos-r p-b-30'>
        <div class="p-b-30">
            <h3 class="guide-title">入驻开店后，苦于无从下手，怎么办？跟随店铺指引，轻松搞定！</h3>
            <div class="guide-step">
                <span class="selected"><em>1</em>店铺基本设置</span>
                <span><em>2</em>客服配置</span>
                <span><em>3</em>会员整理</span>
                <span><em>4</em>商品维护</span>
                <span><em>5</em>交易设置</span>
                <span><em>6</em>装修</span>
            </div>
            <p class="guide-desc">
                <span>店铺运营的首要任务</span>
            </p>
            <div class="guide-content" style="width:990px;">
                <img class="guide-content-image m-r-30" src="/seller/images/guide/step1.png" alt="第一步：店铺基本设置" width="655">
                <dl class="step-text left" style="top: 140px; left: 50px;">
                    <dt>1</dt>
                    <dd>维护店铺头像、logo等基本信息以及店铺经营信息</dd>
                </dl>
                <dl class="step-text left" style="top: 200px; left: 50px;">
                    <dt>2</dt>
                    <dd>设置店铺订单、发货单打印规格以及对接的打印机，确保店铺订单、发货单可正常打印</dd>
                </dl>
                <dl class="step-text left" style="top: 360px; left: 50px;">
                    <dt>3</dt>
                    <dd>如果店铺支持上门提货，则运营之前需要设置好提货的网点信息</dd>
                </dl>
            </div>
        </div>
        <div class="text-c">
            <button class='btn btn-primary next' data-current='1' data-next='2'>已了解，下一步设置</button>
        </div>
    </div>
    <!--第二步-->
    <div style="display: none" class='page-2 pos-r p-b-30'>
        <div class="p-b-30">
            <h3 class="guide-title">入驻开店后，苦于无从下手，怎么办？跟随店铺指引，轻松搞定！</h3>
            <div class="guide-step">
                <span><em>1</em>店铺基本设置</span>
                <span class="selected"><em>2</em>客服配置</span>
                <span><em>3</em>会员整理</span>
                <span><em>4</em>商品维护</span>
                <span><em>5</em>交易设置</span>
                <span><em>6</em>装修</span>
            </div>
            <p class="guide-desc">
                <span>店铺与消费者之间的互动工具设置</span>
            </p>

            <div class="guide-content"  style="width:990px;">
                <img class="guide-content-image m-r-20" src="/seller/images/guide/step2.png" alt="店铺与消费者之间的互动工具设置" width="746">
                <dl class="step-text left" style="top: 120px; left: 0px; width: 220px">
                    <dt>1</dt>
                    <dd>设置店铺不同的管理员，分别打理店铺</dd>
                </dl>
                <dl class="step-text left" style="top: 170px; left: 0px; width: 220px">
                    <dt>2</dt>
                    <dd>云旺客服，一种使用率较高的客服工具，可自行选择是否使用</dd>
                </dl>
                <dl class="step-text left" style="top: 225px; left: 0px; width: 225px">
                    <dt>3</dt>
                    <dd>先设置客服类型，然后在客服管理中添加QQ和旺旺客服时选择客服类型</dd>
                </dl>
            </div>
        </div>
        <div class="text-c">
            <button class='btn btn-primary pre' data-current='2' data-pre='1'>上一步</button>
            <button class='btn btn-primary next' data-current='2' data-next='3'>已了解，下一步设置</button>
        </div>
    </div>
    <!--第三步-->
    <div style="display: none" class='page-3 pos-r p-b-30'>
        <div class="p-b-30">
            <h3 class="guide-title">入驻开店后，苦于无从下手，怎么办？跟随店铺指引，轻松搞定！</h3>
            <div class="guide-step">
                <span><em>1</em>店铺基本设置</span>
                <span><em>2</em>客服配置</span>
                <span class="selected"><em>3</em>会员整理</span>
                <span><em>4</em>商品维护</span>
                <span><em>5</em>交易设置</span>
                <span><em>6</em>装修</span>
            </div>
            <p class="guide-desc">
                <span>店铺会员等级设置</span>
            </p>

            <div class="guide-content" style="height:360px; width:990px;">
                <img class="guide-content-image" style="margin-right: 120px;" src="/seller/images/guide/step3.png" alt="第三步：会员整理" width="570">
                <dl class="step-text left" style="top: 140px; left: 80px;">
                    <dd class="p-l-0">设置成为店铺会员的条件以及享受的折扣</dd>
                </dl>
            </div>
        </div>
        <div class="text-c">
            <button class='btn btn-primary pre' data-current='3' data-pre='2'>上一步</button>
            <button class='btn btn-primary next' data-current='3' data-next='4'>已了解，下一步设置</button>
        </div>
    </div>
    <!--第四步-->
    <div style="display: none" class='page-4 pos-r p-b-30'>
        <div class="p-b-30">
            <h3 class="guide-title">入驻开店后，苦于无从下手，怎么办？跟随店铺指引，轻松搞定！</h3>
            <div class="guide-step">
                <span><em>1</em>店铺基本设置</span>
                <span><em>2</em>客服配置</span>
                <span><em>3</em>会员整理</span>
                <span class="selected"><em>4</em>商品维护</span>
                <span><em>5</em>交易设置</span>
                <span><em>6</em>装修</span>
            </div>
            <p class="guide-desc">
                <span>店铺售卖商品相关信息维护</span>
            </p>

            <div class="guide-content" style="width:990px;">
                <img class="guide-content-image" style="margin-right: 160px;" src="/seller/images/guide/step4.png" alt="第四步：商品维护" width="440">
                <dl class="step-text left" style="top: 280px; left: 240px;">
                    <dt>1</dt>
                    <dd>添加店铺商品分类</dd>
                </dl>
                <dl class="step-text left" style="top: 318px; left: 193px;">
                    <dt>2</dt>
                    <dd>设置店铺售卖的范围及运费</dd>
                </dl>
                <dl class="step-text left" style="top: 170px; max-width: 260px; left: 110px;">
                    <dt>3</dt>
                    <dd>
                        维护商品数据：
                        </br>
                        方式一：人工添加商品
                        </br>
                        方式二：采集云产品库、淘宝天猫商品数据
                        </br>
                        方式三：导入系统商品库商品数据
                    </dd>
                </dl>
            </div>
        </div>
        <div class="text-c">
            <button class='btn btn-primary pre' data-current='4' data-pre='3'>上一步</button>
            <button class='btn btn-primary next' data-current='4' data-next='5'>已了解，下一步设置</button>
        </div>
    </div>
    <!--第五步-->
    <div style="display: none" class='page-5 pos-r p-b-30'>
        <div class="p-b-30">
            <h3 class="guide-title">入驻开店后，苦于无从下手，怎么办？跟随店铺指引，轻松搞定！</h3>
            <div class="guide-step">
                <span><em>1</em>店铺基本设置</span>
                <span><em>2</em>客服配置</span>
                <span><em>3</em>会员整理</span>
                <span><em>4</em>商品维护</span>
                <span class="selected"><em>5</em>交易设置</span>
                <span><em>6</em>装修</span>
            </div>
            <p class="guide-desc">
                <span>店铺会员等级设置</span>
            </p>
            <div class="guide-content" style="width:990px;">
                <img class="guide-content-image" style="margin-right: 160px;" src="/seller/images/guide/step5.png" alt="第五步：交易设置" width="485">
                <dl class="step-text left" style="top: 305px; left: 80px;">
                    <dd class="p-l-0">设置订单是否自动打印、店铺发货和退货地址配置</dd>
                </dl>
            </div>
        </div>
        <div class="text-c">
            <button class='btn btn-primary pre' data-current='5' data-pre='4'>上一步</button>
            <button class='btn btn-primary next' data-current='5' data-next='6'>已了解，下一步设置</button>
        </div>
    </div>
    <!--第六步-->
    <div style="display: none" class='page-6 pos-r p-b-30'>
        <div class="p-b-30">
            <h3 class="guide-title">入驻开店后，苦于无从下手，怎么办？跟随店铺指引，轻松搞定！</h3>
            <div class="guide-step">
                <span><em>1</em>店铺基本设置</span>
                <span><em>2</em>客服配置</span>
                <span><em>3</em>会员整理</span>
                <span><em>4</em>商品维护</span>
                <span><em>5</em>交易设置</span>
                <span class="selected"><em>6</em>装修</span>
            </div>
            <p class="guide-desc">
                <span>店铺装修即店铺门面展示，完美的门面，将吸引更多的客户，店铺装修完成后即可正式运营啦！</span>
            </p>

            <div class="guide-content" style="width:990px;">
                <img class="guide-content-image" style="margin-right: 120px;" src="/seller/images/guide/step6.png" alt="第六步：装修" width="800">
                <dl class="step-text left" style="top: 240px; left: 80px;">
                    <dt>1</dt>
                    <dd>店铺导航菜单设置</dd>
                </dl>
                <dl class="step-text left" style="top: 280px; left: 80px;">
                    <dt>2</dt>
                    <dd>进行店铺装修设计</dd>
                </dl>
            </div>
        </div>
        <div class="text-c">
            <button class='btn btn-primary pre' data-current='6' data-pre='5'>上一步</button>
        </div>
    </div>

@stop

{{--script page元素内--}}
@section('script')

@stop

{{--extra html block--}}
@section('extra_html')

@stop


{{--helper_tool--}}
@section('helper_tool')

@stop

{{--自定义css样式--}}
@section('style_css')

@stop

{{--footer script page元素同级下面--}}
@section('footer_script')
    <script type="text/javascript">
        $().ready(function() {
            $('#next_display').click(function() {
                var data = 0;
                if ($(this).is(':checked')) {
                    data = 1;
                }

                $.get("/index/index/guide-show.html", {
                    data: data
                }, function(result) {
                });

            });
            $('.next').click(function() {
                var curren = $(this).data('current');
                var next = $(this).data('next');
                if (curren == 6) {
                    $.closeAll();
                }
                $('.page-' + curren).hide();
                $('.page-' + next).show();

            });
            $('.pre').click(function() {
                var curren = $(this).data('current');
                var pre = $(this).data('pre');
                $('.page-' + curren).hide();
                $('.page-' + pre).show();
            });
        });
    </script>
@stop

{{--outside body script--}}
@section('outside_body_script')

@stop